// import React from 'react'
import React,{useState} from 'react'
import './Focus.css'

//rfc快捷键创建函数组件
export default function Focus() {

    // let [id,setId]=React.useState(1);
    
    let [id,setId]= useState(1);

    //下一张 图片
    let next=()=>{
        if(id<=5){
            setId(id++);
        }else{
            setId(1);
        }
    }

    //上一张
    let prev=()=>{
        if(id>=1){
            setId(id--);
        }else{
            setId(5);
        }
    } 
    
  return (
    <div className='focus'>
        <img src={`/img/${id}.jpg`} alt="" />
        <div className='prev btn' onClick={prev}>&lt;</div>
        <div className='next btn' onClick={next}>&gt;</div>
    </div>
  )
}
